<template>
  <view style="background: #f6f6f6;height: 100vh;overflow-y: scroll">
    <head-bar-view @otherClick="otherClick" title="楼层详情" title-color="#fff" is-white-back="true"
                   other-img="/static/map.png"/>
    <select-head-view :title1="title1" :title2="title2" hint1="当前楼层：" hint2="共计："
                      @sure="sure" :select-list="selectList"/>
    <view v-for="(item ,ind ) in list" :key="ind">
      <view class="f_row_center" style="font-size: 30rpx;background: #ffffff;padding: 20rpx;margin-top: 20rpx">
        <image src="/static/house_02.png" style="height: 36rpx;width: 36rpx;margin-right: 10rpx"/>
        {{ item.unitname }}
      </view>
      <item-house-level-card-view style="background: #ffffff" :item="it" v-for="(it ,index ) in item.roomlist"
                                  :key="index"/>


    </view>
    <no-data-view :list="list" :load-state="loadState"/>
    <uni-load-more :status="loadState"></uni-load-more>
  </view>

</template>

<script lang="ts">
import {Vue, Component} from "vue-property-decorator";
import HeadBarView from "@/pages/components/head_bar_view.vue";
import XRouterConfig from "@/api/XRouterConfig";
import ItemHouseLevelCardView from "@/pages/unit/components/item_house_level_card_view.vue";
import BaseApi from "@/api/BaseApi";
import ApiDefine from "@/api/ApiDefine";
import MenuListView from "@/pages/components/menu_list_view.vue";
import DropdownMenu from "@/pages/components/dropdown-menu.vue";
import DropdownItem from "@/pages/components/dropdown-item.vue";
import NoDataView from "@/pages/components/no_data_view.vue";
import DrawSelectView from "@/pages/components/draw_select_view.vue";
import SelectHeadView from "@/pages/components/select_head_view.vue";
import {mixins} from "vue-class-component";
import StateConfig from "@/mixins/StateConfig";

@Component({
  components: {
    SelectHeadView,
    HeadBarView,
    ItemHouseLevelCardView,
    DropdownMenu,
    DropdownItem,
    NoDataView,
    DrawSelectView,
  }
})
export default class UnitHouseLevelView extends mixins(Vue, StateConfig) {
  otherClick() {
    XRouterConfig.goTo('unit_house_level_img',
        {
          osid: this.osid,
          offid: this.offid,
          bliid: this.bliid,
        })
  }

  selectList:any = [
    {
      title: '选择楼层',
      list: [],
    },
    {
      title: '房屋类型',
      list: [],
    },
    {
      title: '单位信息',
      list: [],
    },
  ];
  houseTypeStr = '房屋类型'
  levelTypeStr = '选择楼层'
  houseUnitStr = '单位信息'


  setSelectList() {
    this.houseList.forEach((it: any, index: any) => {
      it.title = it.layername;
      if (index == 0) {
        this.bliid = this.houseList[0].bliid;
        this.title1 = this.houseList[0].layername;
        it.isChose = true;
        return
      }
      it.isChose = false;
    })
    this.roomTypeList.forEach((it: any) => {
      it.title = it.typename;
      it.isChose = false;
    })
    this.houseUnitList.forEach((it: any) => {
      it.title = it.unitname;
      it.isChose = false;
    })
    this.selectList.forEach((item: any) => {
      if (item.title == this.levelTypeStr) {
        item.list = this.houseList
      } else if(item.title==this.houseTypeStr) {
        item.list = this.roomTypeList
      }else if(item.title==this.houseUnitStr) {
        item.list = this.houseUnitList
      }
    })
  }

  sure(title: any, ind: any, index: any) {
    if (this.houseTypeStr == title) {
      this.choseType(this.selectList[ind].list[index])
    }
    if (this.levelTypeStr == title) {
      this.choseHouseLevel(this.selectList[ind].list[index])
    }
    if (this.houseUnitStr == title) {
      this.osid=this.selectList[ind].list[index].osid;
    }
    this.initData()
  }


  osid: any = '';
  offid: any = '';
  bliid: any = ''
  ssdid: any = ''

  onLoad(option: any) {
    this.offid = option.offid ?? ''
    this.osid = option.osid ?? ''
    this.initHouseUnit(option.offid ?? '');
    this.initHouseLevel(this.osid , option.offid ?? '')
    this.initRoomType();
  }


  houseList: any = [];

  title1 = ''
  title2 = ''

  houseUnitList:any=[];
  async initHouseUnit(offid: any) {
    let value = await BaseApi.instance().fetch(ApiDefine.HOUSE_UNIT_TYPE_URL, {
      offid,
    })
    if (value == null || value.code != 200) {
      return;
    }
    this.houseUnitList=value.data;
    this.setSelectList();
    this.initData()
  }

  async initHouseLevel(osid: any, offid: any) {
    let value = await BaseApi.instance().fetch(ApiDefine.UNIT_HOUSE_LEVEL_LIST_URL, {
      osid,
      offid,
    })
    if (value == null || value.code != 200) {
      return;
    }
    this.houseList = value.data;
    if (this.houseList.length == 0) {
      return;
    }
    this.setSelectList();
    this.initData()
  }

  roomTypeList: any = [];

  async initRoomType() {
    let value = await BaseApi.instance().fetch(ApiDefine.UNIT_ROOM_TYPE_URL, {})
    if (value == null || value.code != 200) {
      return;
    }
    this.roomTypeList = value.data;
    this.setSelectList();
  }

  list: any = [];

  choseHouseLevel(item: any) {
    // (this.$refs.houseDrop as any)?.close()
    this.bliid = item.bliid
    this.title1 = item.layername;

  }

  choseType(item: any) {
    // (this.$refs.levelDrop as any)?.close()
    this.ssdid = item.ssdid
    // this.title2 = item.typename;
  }

  loadState = 'more';

  async initData() {
    this.loadState = 'loading'
    let value = await BaseApi.instance().fetch(ApiDefine.UNIT_HOUSE_ROOM_LIST_URL, {
      osid: this.osid,
      offid: this.offid,
      bliid: this.bliid,
      ssdid: this.ssdid,
    })
    if (value == null || value.code != 200) {
      return;
    }
    this.loadState = 'no-more'
    this.list = value.data.unitlist;
    this.title2 = value.data.roomnum + '间';
  }


}
</script>

<style scoped>
.item_picker {
  padding: 20rpx;
}
</style>
